<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>酒店预订</title>
    {% load static %}
    <style type="text/css">
        *{
            margin: 0;
            padding: 0;
        }
        #index_head{
            position: relative;
            top: 40px;
            width: 1600px;
            height: 34px;
            margin: 0 auto;
        }
        #index_head > ul{
            border-radius: 8px;;
            width: 660px;
            height: 100%;
            margin: 0 auto;
            background-color: #226399;
            list-style-type: none;
        }
        #index_head > ul > li{
            float: left;
            margin-left: 54px;
        }
        #index_head > ul > li > a{
            font-size: 1.2em;
            color: white;
            text-decoration:none;
            font-weight:bold;
        }
#main{
     width: 1600px;
     height:1000px;
     margin: 0 auto;
     position: relative;
     top:50px;
 }
#foot{
    position: relative;
    top: 50px;

}
 #foot div{
     width: 25%;
     height: 100%;
     position: relative;
     float: left;
 }
 #foot div dl dt{
     line-height: 54px;
     color: #595757;
     font-weight: bold;
 }
    </style>
<script type="text/javascript">
</script>
</head>
<body>
<div id="bg" style="position: fixed;width: 100%;height: 100%;background-color: rgba(0,0,0,0.4);z-index: 1000;display: none"></div>
<div id = "index_head">
    <ul>
        <li><a href="indexpage">首页</a></li>
        <li><a href="book">酒店预订</a></li>
        <li><a href="myreserve">订单查看</a></li>
        <li><a href="myinfo">我的信息</a></li>
        <li><a href="{{ login_URL}}">{{ login}}|</a><a href="sighup">注册</a></li>
    </ul>
</div>
<div id="main">
    {% block content %}{% endblock content %}
</div>
<div id = "foot" style="width: 80%;height: 200px;margin: 0 auto">
        <div style="width: 70%;margin: 0 auto">
            <div id="left" >

            </div>
            <div id="midleft" >
                <dl>
                    <dt>酒店预订</dt>
                    <dt>订单查看</dt>
                    <dt>我的信息</dt>
                </dl>
            </div>
            <div id="midright">
                <dl>
                    <dt>酒店信息</dt>
                    <dt>地理位置</dt>
                    <dt>注销</dt>
                </dl>
            </div>
            <div id="right" >
                <dl>
                    <dt>作者</dt>
                    <dt>@Eather Too</dt>
                    <dt>版权信息</dt>
                </dl>
            </div>
        </div>
        <div style="height: 100%;width: 30%">
            <img height="96%" style="margin-right: 52px;" src="static/img/qr.png"/>
        </div>

    </div>
</body>
</html>